
<?php
@session_start();
if (!isset($_SESSION['user'])) {
	require_once('login.php');
	exit();
}

if (!isset($_GET['nid'])) {
	require_once 'profile.php';
	exit();
}

require_once "ajax.php";

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
		<title>Zibro Chat Room Concept Page</title>

		<link rel="stylesheet" type="text/css" media="screen" href="css/topics.css" />
		<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
		<link rel="icon" href="./img/favicon.ico" type="image/x-icon" />
		<link rel="shortcut icon" href="./img/favicon.ico" type="image/x-icon" />
		<link rel="stylesheet" type="text/css" media="screen" href="css/article.css" />
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
		<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
		<script type="text/javascript" src="js/common.js"></script>
		<script type="text/javascript" src="js/galaxy.js"></script>
		<script src="js/topics.js" type="text/javascript"></script>
		<script>
			var session_user_info = <?php echo json_encode($_SESSION['user'])?>;
            if( session_user_info['avatar'] == 0 ) {
				session_user_info['avatar'] = "./img/noavatar_small.gif";
			}
			var nebula_id = "<?php echo $_GET['nid']; ?>";
			var nebula_name = <?php echo json_encode( Nebula::get_nebula_name($_GET['nid']) )?>;
            var post_id = "<?php if(isset($_GET['pid'])){
                echo $_GET['pid'];} else { echo '';}?>"
		</script>
        <style>
            /*for chrome */
            ::-webkit-scrollbar {
                width: 4px;
            }

            /* Track */
            ::-webkit-scrollbar-track {
                -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.3);
                -webkit-border-radius: 10px;
                border-radius: 10px;
            }

            /* Handle */
            ::-webkit-scrollbar-thumb {
                -webkit-border-radius: 10px;
                border-radius: 10px;
                background: rgba(200,200,200,0.8);
            }
            ::-webkit-scrollbar-thumb:window-inactive {
				cursor: pointer;
                background: rgba(200,200,200,0.4);
			}

        </style>
		<!--<script src="js/chat.js" type="text/javascript"></script>!-->

	</head>
	<body>
        <div id="topBar"></div>
		<div id="content-container" class="rounded">
			<div id="topics-container" class="section-padding">
				<div id="topic-nav" class="section-area" style="display:none;border-bottom: 1px dotted #CECECE;"><span>
                        <a id="nav-title" href="./profile.php"></a>
                        <font id="nebula-sep"></font><a id="nav-nebName" class="return-topic isfocus"></a>
                        <font id="post-sep" class="post-nav"></font><a id="nav-posName"class="post-nav"></a>
                        <input id="current-pid" type="hidden"></input>
                        <input id="current-page" type="hidden"></input>
                    </span></div>
				<div id="topics-items-block">
                    <div id="loading-image"></div>
                    
					<ul class="topic-list" style="height:600px;overflow:auto;display:none;">
					</ul>
                    <div id="article-container" style="display:none;height:600px;overflow:auto;">

						<div class="article-block">
							<span class="title"><h2></h2>		
                                <span class="post-info">
                                    <a class="return-topic isfocus" name="#article-container">[<<]</a>
									<a class="post-click">Hot:<font id="click_count">0</font></a>
								</span>
                                <span class="post-op">
                                    <a id="markFun" class="op-item isfocus post-mark" name="addFigure">[mark]</a>
                                    <a id="unmarkFun" class="op-item isfocus post-mark" name="removeFigure">[unmark]</a>
									<a id="op-content"></a>
								</span>
                                <p class="post-tag"></p>
							</span>
							<span class="content"></span>

						</div>
                        <div class="section-area" style="background-color: #404040; color: white;">
							<div style="font-size:15px;">
								<a>Related Galaxies</a>
								<a class="create-dis article-op pop-fun isfocus" name="#add-galaxy">[add]</a>
							</div>
						</div>
                        <div id="galaxy-block"></div>
                    </div>
				</div>
                <div id="page-content"></div>
			</div>
			<div id="mytopics-figure-container">
				<div class="section-area"><h2 id="nebula_fav"style="height:20px;display:none;"></h2></div>
				<div id="mytopics-figure-block" class="rounded">
					<div class="mask"></div>
					<div class="meIcon"><span>ME</span></div>
				</div>
			</div>
			
			<div id="discussion" class="window rounded shadowL">
				<div class="galaxy-title roundedS"><span style="float:left;" class="g-title-text">Discussion</span><span style="float: right;"><a href="#" class="close">X</a></span></div>
				<div class="galaxy-container">
					
					
					<div class="left-column borderDiv">
						<div class="chat-wrap">
							<div id="chat-column1" class="chat-column">
								<ul>
								</ul>
							</div>
							<div id="chat-column2" class="chat-column">
								<ul>
								</ul>
							</div>
						</div>
						<div class="chat-page-options"><div class="quit-galaxy roundedS option-button">Quit Galaxy</div><div class="next-page roundedS option-button">Next Page</div></div>
						<div class="tri" style="height: 10px;"></div>
						<div class="send-wrap">
							<div class="input-options">
								<ul>
									<li class="emotions"><img src="img/emos/emotions_02.png"/></li>
									<li class="boldFont">B</li>
									<li class="italicFont">I</li>
								</ul>
							</div>
							<div class="input-content">
								<div class="send-input inner-shadow borderDiv">
									<form class="send-message-area" method="post" action="">
										<textarea class="sendie roundedS" name="sendie"></textarea>
									</form>
								</div>
							<div class="send-btn">Send</div>
							</div>
						</div>
						<div class="emotions-set-fun">
							<ul>
							</ul>
						</div>
					</div>
					<div class="right-column">
						<div class="sideBar shadowL2">
							<div id="expandUser-sideBar" class="sideBarEle">
								U S E R s
							</div>
							<div id="chatLog-sideBar" class="sideBarEle">
								C h a t L o g
							</div>
						</div>
						<ul>
							
						</ul>
					</div>
				</div>
				<!--
				<button id="test" type="button">Next Page</button>
				<button id="test2" type="button">Click2</button>
				<li><a href="#chat-log" name="modal">Show log</a></li>
				-->
				
				<div class="infoMsg rounded shadowL">
				</div>
			</div>
			<div id="add-galaxy" class="window">
				<div class="galaxy-title roundedS">
                    <span style="float:left">Create a Galaxy</span>
                    <span style="float:right"><a href="#" id="quit-addgalaxy" class="isfocus">X</a></span>
                    
                </div>
                <div id="galaxy-container">
                    <table class="galaxybox" cellspacing="1px">
                        <thead>
                            <tr>
                                <th></th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr class="row1">
                                <td class="c1">
                                    <strong>Title</strong>
                                </td>
                                <td class="c2">
                                    <input class="subject" maxlength="100" id="galaxy_subject" size="40" value=""></input>
                                </td>
                            </tr>

                            <tr class="row3">
                                <td class="c1" style="vertical-align:top">
                                    <strong>Notes(optional)</strong>
                                </td>
                                <td class="c2">
                                    <input class="subject" maxlength="100" id="galaxy_content" size="40" value=""></input>
                                </td>
                            </tr>
                            
                        </tbody>
                    </table>
                    <div class="add-tags">
                        <strong>Add co-nebulas(optional):</strong>
                        <div class="tags">
                            <div id="galaxy-tags" class="roundedS"></div>
                            <div id="add-galaxy-tags" class="topic-button">+</div>
                            <div id="galaxy-nebula"></div>
                        </div>
                        <div id="add-galaxy-fun" class="topic-button submit-layout"><strong>Submit</strong></div>
                    </div>
                    
                </div>

			</div>
            <div id="add-post" class="window">
                <div class="post-title roundedS">
                    <span style="float:left">Write a post</span>
                    <span style="float:right"><a href="#" id="quit-addpost" class="isfocus">X</a></span>

                </div>
                <div id="post-container">                   
                    <table class="postbox" cellspacing="1px">
                        <thead>
                            <tr>
                                <th></th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr class="row1">
                                <td class="c1">
                                    <strong>Title</strong>
                                </td>
                                <td class="c2">
                                    <input class="subject" maxlength="100" name="post_subject" id="post_subject" size="60" value=""></input>
                                    
                                </td>
                            </tr>
                            <tr class="row2">
                                <td class="c1">
                                    <strong>Tools</strong>
                                </td>
                                <td class="c2">
                                    <div id="post-tools">
                                        <a name="image" class="isfocus">
                                            <b>[img]</b>
                                            <br/><nobr>insert image</nobr>
                                        </a>
                                        <a name="flash" class="isfocus">
                                            <b>[flash]</b>
                                            <br/><nobr>insert flash</nobr>
                                        </a>
                                        <a name="url" class="isfocus">
                                            <b>[url]</b>
                                            <br/><nobr>insert url</nobr>
                                        </a>
                                    </div>
                                </td>
                            </tr>
                            <tr class="row3">
                                <td class="c1" style="vertical-align:top">
                                    <strong>Body</strong>
                                </td>
                                <td class="c2">
                                    <textarea id="post_content" name="post_content" rows="10" cols="100"
                                              style="width:98%;height:250px;line-height:20px"></textarea>
                                </td>
                            </tr>
                            
                        </tbody>
                    </table>
                    <div class="add-tags">
                        <strong>Add co-nebulas(optional):</strong>
                        <div class="tags">
                            <div id="post-tags" class="roundedS"></div>
                            <div id="add-post-tags" class="topic-button">+</div>
                            <div id="post-nebula"></div>
                        </div>
                        <div id="add-post-fun" class="topic-button submit-layout"><strong>Submit</strong></div>
                    </div>
                    
                    
                </div>

            </div>
            <!--
			<div id="lit" class="window">
				<strong class="comment-title"></strong>
				<strong class="topic-button exitWindow exitLayout">OK</strong>
			</div>
			<div id="dim" class="window">
				<strong class="comment-title"></strong>
				<strong class="topic-button exitWindow exitLayout">OK</strong>
			</div>
            -->
            <div id="delete" class="window">
                <strong class="comment-title">Are you sure to delete this post?</strong>
                <br/><br/><strong id="deleFun" class="topic-button" style="margin-right:10px;">Yes</strong>
                <strong class="topic-button exitWindow"style="margin-left:10px;">No</strong>
            </div>

            <div id="tool-content" class="window">
                
            </div>
			<!-- Mask to cover the whole screen -->
			<div id="mask"></div>
		</div>
	</body>
</html>